﻿@model Zor_Web.Models.Systems.V_Navigations
@using Webdiyer.WebControls.Mvc;
@{
    Layout = null;
}
<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>菜单管理</title>
    <link href="~/Content/LayerUI/src/css/layui.css" rel="stylesheet" />
    <link href="~/Content/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
    <link href="~/Content/Styles/zor.css" rel="stylesheet" />
    <!-- 框架必要 -->
    <script src="~/Content/Scripts/jquery/jquery-1.9.1.min.js"></script>
    <script src="~/Content/Scripts/learunui-framework.js"></script>
    <script src="~/Content/Scripts/Zor_AJax.js"></script>
    <!-- 消息提示 -->
    <script language='javascript' src='~/Content/layer/layer.js'></script>
    <!-- 表单验证 -->
    <script src="~/Content/Scripts/JValidator.js"></script> 
</head>
<body class="gray-bg">
    <div class="layui-tab layui-tab-brief main-tab-container ">

        <div class="col-sm-12 ct-padding">
            <div class="col-sm-9 ct-padding">
                <button id="btnAdd" class="layui-btn layui-btn-normal layui-btn-small"><span class="glyphicon glyphicon-plus"></span> 新增</button>
                <button id="btnUpdate" class="layui-btn layui-btn-warm layui-btn-small"><span class="glyphicon glyphicon-pencil"></span> 编辑</button>
                <button id="btnDelete" class="layui-btn layui-btn-danger layui-btn-small"><span class="glyphicon glyphicon-trash"></span> 删除</button>                
            </div>
            <div class="col-sm-3 ct-padding">
                <div class="input-group">
                    <input id="inputWhere" type="text" placeholder="" autocomplete="off" class="form-control">
                    <span class="input-group-btn">
                        <button id="btnSearch" class="btn btn-info" type="button"><span class="glyphicon glyphicon-search"></span> 搜索</button>
                    </span>
                </div>
            </div>
        </div>
        <div class="layui-tab-content">
            <table class="layui-table" lay-skin="line">
                <thead>
                    <tr>
                        <th hidden></th>
                        <th><input type="checkbox" name="checkAll" id="cbkCheckAll"></th>
                        <th>菜单名称</th>
                        <th>菜单等级</th>
                        <th>所属父级</th>
                        <th>菜单标识</th>
                        <th>菜单图片</th>
                        <th>菜单地址</th>
                        <th>是否启用</th>
                        <th>菜单顺序</th>

                    </tr>
                </thead>
                <tbody id="accordion">
                    @foreach (var item in Model.PageData)
                    {
                        <tr class="read">
                            <td hidden>@item.Nav_Id</td>
                            <td><input type="checkbox" name="chk" id="@item.Nav_Id" value="@item.Nav_Id"></td>
                            <td>@item.Nav_Title</td>
                            <td>@item.Nav_LevelName</td>
                            <td>@item.ParentName</td>
                            <td>@item.Nav_NavTag</td>
                            <td>@item.Nav_Icon</td>
                            <td>@item.Nav_Linkurl</td>
                            <td>@item.IsVisibleName</td>
                            <td>@item.Nav_Sortnum</td>
                            <td hidden>@item.Nav_ParentID</td>
                            <td hidden>@item.Nav_Level</td>
                            <td hidden>@item.Nav_IsVisible</td>
                        </tr>
                    }
                </tbody>
            </table>
            <div class="col-sm-12">
                <div class="col-sm-10">
                    @Html.Pager(Model.PageData, new PagerOptions { PageIndexParameterName = "index", ContainerTagName = "ul", PrevPageText = "上页", NextPageText = "下页", FirstPageText = "首页", LastPageText = "尾页", CssClass = "pagination", PagerItemsSeperator = "", CurrentPagerItemWrapperFormatString = "<li class=\"active\"><a href=\"#\">{0}</a></li>", PagerItemWrapperFormatString = "<li>{0}</li>" }, new { id = "bootstrappager", @class = "pagination" })
                </div>
                <div class="col-sm-2 to-righjt">
                    共 @Model.PageData.TotalItemCount 条记录，页 @Model.PageData.CurrentPageIndex/@Model.PageData.TotalPageCount
                </div>
            </div>
        </div>
    </div>
    <!-- 模态 -->
    <div id="myModal" hidden data-backdrop="static">
        <div id="divfrom" class="layui-tab-content">
            <form method="get" class="form-horizontal m-t">
                <div class="layui-form-item" hidden>
                    <label class="col-sm-3 layui-form-label">菜单Id：</label>
                    <div class="col-sm-8">
                        <input id="Nav_Id" type="text" class="form-control">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="col-sm-3 layui-form-label">菜单名称：</label>
                    <div class="col-sm-8">
                        <input id="Nav_Title" type="text" class="form-control" placeholder="请输入菜单名称" autofocus="autofocus" datacol="yes" err="菜单名称" checkexpession="NotNull">
                    </div>
                </div>
                
                <div class="layui-form-item" id="divNav">
                    <label class="col-sm-3 layui-form-label">
                        <nobr>所属菜单：</nobr>
                    </label>
                    <div class="col-sm-8">
                        <select name="temp" class="form-control" id="Nav_ParentID"></select>
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="col-sm-3 layui-form-label">菜单标识：</label>
                    <div class="col-sm-8">
                        <input id="Nav_NavTag" type="text" class="form-control" placeholder="请输入菜单标识" autofocus="autofocus">
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="col-sm-3 layui-form-label">菜单图片：</label>
                    <div class="col-sm-8">
                        <input id="Nav_Icon" type="text" class="form-control" placeholder="请输入菜单图片" autofocus="autofocus">
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="col-sm-3 layui-form-label">菜单地址：</label>
                    <div class="col-sm-8">
                        <input id="Nav_Linkurl" type="text" class="form-control" placeholder="请输入菜单地址" autofocus="autofocus">
                    </div>
                </div>
                
                <div class="layui-form-item" id="divLevel">
                    <label class="col-sm-3 layui-form-label">
                        <nobr>所属等级：</nobr>
                    </label>
                    <div class="col-sm-8">
                        <select name="temp" class="form-control" id="Nav_Level">
                            <option value="1">一级</option>
                            <option value="2">二级</option>
                            <option value="3">三级</option>
                            <option value="4">四级</option>
                        </select>
                    </div>
                </div>
                
                <div class="layui-form-item" id="divIsVisible">
                    <label class="col-sm-3 layui-form-label">
                        <nobr>是否启用：</nobr>
                    </label>
                    <div class="col-sm-8">
                        <select name="temp" class="form-control" id="Nav_IsVisible">
                            <option value="1">是</option>
                            <option value="2">否</option>
                        </select>
                    </div>
                </div>
             
                <div class="layui-form-item">
                    <label class="col-sm-3 layui-form-label">菜单顺序：</label>
                    <div class="col-sm-8">
                        <input id="Nav_Sortnum" type="text" class="form-control" placeholder="请输入菜单顺序" autofocus="autofocus">
                    </div>
                </div>
            </form>
            <div class="hr-line-dashed"></div>
            <div class="form-group">
                <div class="col-sm-11 ">
                    <button id="btnSure" class="btn btn-info pull-right">
                        <i class="fa fa-check"></i>提交
                    </button>
                </div>
            </div>

        </div>
    </div>  

</body>
</html>
<script>
    $(function () {
        /** 查询  */
        $("#btnSearch").click(function () {

        });

        /** 增加菜单 */
        $("#btnAdd").click(function () {
            ClearWebControls(divfrom);
            GetAccordionNavSelectNavTree();//加载所有菜单
            LayerOpen('650px', '580px', '菜单新增', $('#myModal'));
        })

        /** 保存 */

        $("#btnSure").click(function () {
            if (!CheckDataValid('.form-horizontal')) {
                return false;
            }
            var JsData = GetWebControls(divfrom);
            ZorPostSimpleData("/Systems/AddAlterNavigations", JSON.stringify({ "sys_navigations": JsData }), function (data) {
                layer.msg(data.AnswerMeg, function () {
                    layer.closeAll();
                    Replace();
                });
            });           
        })

        /** 修改用户 */

        $("#btnUpdate").click(function () {
            var checkId = CheckboxValueIDs();
            $("#Nav_Id").attr("disabled", "disabled");
            if (checkId.length == 0) {
                layer.msg("请选择要修改的信息！");
                return;
            }
            if (checkId.length > 1) {
                layer.msg("仅可选择一行信息修改！");
                return;
            }
            GetAccordionNavSelectNavTree();//加载所有菜单
            Allow(true);
            $("#Nav_Id").val(checkId[0]);
            $("#Nav_Title").val(getTableCell(2));
            $("#Nav_NavTag").val(getTableCell(5));
            $("#Nav_Icon").val(getTableCell(6));
            $("#Nav_Linkurl").val(getTableCell(7));
            $("#Nav_ParentID").val(getTableCell(10));
            $("#Nav_Level").val(getTableCell(11));
            $("#Nav_IsVisible").val(getTableCell(12));
            $("#Nav_Sortnum").val(getTableCell(9));
            LayerOpen('650px', '580px', '菜单修改', $('#myModal'));
        })

        /*** 删除菜单 */
        $("#btnDelete").click(function () {
            var checkId = CheckboxValueIDs();
            if (checkId.length == 0) {
                layer.msg("请选择要删除的菜单！");                                                             //未选中任何行
                return;
            }
            else {
                layer.confirm("确定要删除吗?", { icon: 2, btn: ['确定', '取消'] }, function () {
                    ZorPostSimpleData("/Systems/DeleteNavigations", JSON.stringify({ 'Id': checkId }), function (data) { //获取数据(带参数)
                        layer.msg(data.AnswerMeg, function () {
                            layer.closeAll();
                            Replace();
                        });
                    })
                })
            }
        })
    })
    /**
     * 查询所有菜单树形展示
     */
    function GetAccordionNavSelectNavTree() {
        var html = "";
        getAjax("/Systems/SelectNavTree", "", function (data) {
            accordionJson = eval("(" + data + ")");
            $.each(accordionJson, function (i) {
                html += "<option value='" + accordionJson[i].Nav_Id + "' >" + accordionJson[i].LevName + "</option>";
            });           
        });
        $("#Nav_ParentID").empty().append(html);
    }
    /**
     * 全选
     */
    $(function () {
        $("#cbkCheckAll").click(function () {
            if (this.checked) {
                $("input[name='chk']").prop('checked', true);
            } else {
                $("input[name='chk']").prop('checked', false);
            }
        })
    })


</script>



